<template>
  <div class="son">
    <h2>这是子组件</h2>
    <p>{{ son }}</p>
    <button @click="b1">改变父组件的值</button>
    <button @click="b2">改变自己的值</button>
  </div>
</template>

<script>
import {mapState} from "vuex";

export default {
  name: "Son",
  data() {
    return {}
  },
  computed: {
    ...mapState(["son", 'father'])
  },
  methods: {
    b1() {
      this.$store.dispatch("changeFather", {num: 1})
    },
    b2() {
      this.$store.commit("changeSon", {son: 65656})
    }
  },
}
</script>

<style scoped lang="less">
.son {
  height: 200px;
  background-color: violet;
}
</style>